<template>
 <div id="zhuti">
  <div>
    <div class="breadcrumb">
      <router-link to="/index">首页</router-link> &gt; &gt;
      <router-link to="/login">登录</router-link>
    </div>
    <div class="form">
      <div>
        <div>
          <div> <a href="">我是会员</a> </div>
          <div><router-link to="/register">还未注册</router-link> </div>
        </div>
        <div>
          <div>
            <input type="text" placeholder="请输入账号" v-model="phone" style="color:white" />
            <input type="password" placeholder="请输入密码" v-model="upwd"/>
            <button @click="login">登录</button>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

</template>

<script>
import { loginAPI } from '@/api'
    export default {
        data() {
          return {
            phone: '',
            upwd: '',
          }
        },
        methods: {
          // 页面单独刷新一次
          refresh() {
            console.log('刷新');
            this.$router.replace({path: this.$route.path})
          },
          async login() {
            let params = {phone: this.phone,upwd: this.upwd}
            // console.log('用户信息',params);
            const res = await loginAPI(params)
            // console.log('用户登录返回', res.data.data[0]);
            if(res.data.code === 200) {
              this.$message.success('登录成功！')
              this.$store.commit('setUserInfo', res.data.data[0])
              this.$router.push('/index')
              // this.refresh()
              sessionStorage.setItem("user", JSON.stringify(res.data.data[0]))
              // console.log('session', sessionStorage.getItem("user"));
              this.refresh()
            } else {
              this.$message.error('登录失败！账号密码有误！')
            }
          }
        },
    }
</script>

<style scoped src="../assets/css/login.css"></style>

<style lang="scss" scoped>

</style>